import 'package:flutter/material.dart';

import '../../models/device/device.dart';

class DeviceCard extends StatelessWidget {
  final Device device;
  final VoidCallback onTap;

  const DeviceCard({super.key, required this.device, required this.onTap});
  @override
  Widget build(BuildContext context) {
    return Card(
      margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      child: ListTile(
        leading: device.thumbnailUrl != null
            ? SizedBox(
                width: 56, // 👈 符合 Material 规范（<=56）
                height: 56,
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(8),
                  child: Image.network(
                    device.thumbnailUrl!,
                    fit: BoxFit.cover,
                    loadingBuilder: (context, child, loadingProgress) {
                      if (loadingProgress == null) return child;
                      return const Center(child: CircularProgressIndicator());
                    },
                    errorBuilder: (context, error, stackTrace) {
                      return const Center(
                          child: Icon(Icons.broken_image, size: 24));
                    },
                  ),
                ),
              )
            : const Icon(Icons.devices, size: 32), // 无图时显示图标
        contentPadding: const EdgeInsets.all(12),
        title: Text(
          device.name ?? '未知设备',
          style: const TextStyle(fontWeight: FontWeight.bold),
        ),
        subtitle: Text('通道数: ${device.channelCount ?? 0}'),
        trailing: const Icon(Icons.arrow_forward_ios, size: 16),
        onTap: onTap,
      ),
    );
  }
}
